<template>
	<view>
		<u-modal v-model="isShow" :title="title" :title-style="{fontWeight:700}" width="80%"
			:show-confirm-button="false" :content-style="contentStyle">
			<view class="common-model-content">
				<rich-text :nodes="content"></rich-text>
				<view class="common-model-button">
					<view :style="cancelStyle" @click="closeModal">取消</view>
					<view :style="confirmStyle" @click="confirmHandle">{{confirmText}}</view>
				</view>
			</view>
		</u-modal>
	</view>
</template>

<script>
	export default {
		name: "authenModal",
		props:
		{
			title: {
				type: String,
				default: '温馨提示'
			},
			content: {
				type: String,
				default: '请先完成实名认证才可使用'
			},
			confirmText: {
				type: String,
				default: '去认证'
			}
		},
		data() {
			return {
				isShow:true,
				// 内容样式
				contentStyle: {
					height: "80rpx",
					marginTop: "50rpx",
					marginBottom: "180rpx",
					color: "#666666",
					fontSize: "30rpx",
					fontWeight: "500",
					lineHeight: "80rpx",
					textAlign: "center"
				},
				// 取消样式
				cancelStyle: {
					width: "32%",
					height: "80rpx",
					fontSize: "30rpx",
					fontWeight: "bold",
					lineHeight: "80rpx",
					backgroundColor: "#ECECEC",
					borderRadius: "40rpx",
				},
				// 确认样式
				confirmStyle: {
					width: "32%",
					height: "80rpx",
					color: "#fff",
					fontSize: "30rpx",
					fontWeight: "bold",
					lineHeight: "80rpx",
					backgroundColor: "#F4333C",
					borderRadius: "40rpx",
				},
			};
		},
		methods: {
			// 关闭模态框
			closeModal() {
				this.$emit('close',false);
			},
			// 去认证
			confirmHandle() {
				this.$emit('confirm',false);
			
			},
		}
	}
</script>

<style lang="scss" scoped>
	// 模态框
	.common-model-content {

		.common-model-button {
			margin-top: 50rpx;
			display: flex;
			align-items: center;
			justify-content: space-around;
		}
	}
</style>
